﻿@model PerformanceAssessment.Models.AssessmentPeriod

@{
    ViewBag.Title = "Edit";
}

@section Head
{
    <style>
	    #Teams .ui-selecting { background: #FECA40; }
	    #Teams .ui-selected { background: #F39814; color: white; }
	    #Teams { list-style-type: none; margin: 0; padding: 0; width: 100%; }
	    #Teams li { margin: 3px; padding: 0.4em; height: 18px; }
	</style>

    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
    <script type="text/javascript" language="javascript">
        $(document).ready(function () {

            $("#FromDate,#ToDate").datepicker({ dateFormat: "mm/dd/yy" });
            $('#Teams').selectable({
                filter: 'li',
                selected: function (event, ui) {
                    $(ui.selected).find('input.is-selected').val('True');
                },
                unselected: function (event, ui) {
                    $(ui.unselected).find('input.is-selected').val('False');
                }
            });
        });
    </script>
}

<h2>Edit</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Assessment Period</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Description)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Description)
            @Html.ValidationMessageFor(model => model.Description)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.FromDate)
        </div>
        <div class="editor-field">
            <input type="text" id="FromDate" name="FromDate" value="@Model.FromDate.ToShortDateString()" />
            @Html.ValidationMessageFor(model => model.FromDate)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.ToDate)
        </div>
        <div class="editor-field">
            <input type="text" id="ToDate" name="ToDate" value="@Model.ToDate.ToShortDateString()" />
            @Html.ValidationMessageFor(model => model.ToDate)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.IdPreviousAssessmentPeriod)
        </div>
        <div class="editor-field">
            @Html.DropDownList("IdPreviousAssessmentPeriod", "None")
            @Html.ValidationMessageFor(model => model.IdPreviousAssessmentPeriod)
        </div>

        <div class="editor-label">
            Evaluated Teams
        </div>
        <div style="width:300px;max-height:200px;overflow:auto;">
            <ul id="Teams">
                @for (int i = 0; i < Model.Teams.Count; i++)
                {
                    if (Model.Teams[i].Selected)
                    {
                        <li class="ui-selected" >
                            <label>@Model.Teams[i].Name</label>
                            <input type="hidden" id="Teams[@i]_Id" name="Teams[@i].ID" value="@Model.Teams[i].ID" />
                            <input type="hidden" id="Teams[@i]_Selected" name="Teams[@i].Selected" class="is-selected" value="@Model.Teams[i].Selected" />
                        </li>
                    }
                    else
                    {
                        <li>
                            <label>@Model.Teams[i].Name</label>
                            <input type="hidden" id="Teams[@i]_Id" name="Teams[@i].ID" value="@Model.Teams[i].ID" />
                            <input type="hidden" id="Teams[@i]_Selected" name="Teams[@i].Selected" class="is-selected" value="@Model.Teams[i].Selected" />
                        </li>
                    }
                }
            </ul>
        </div>
        <p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>
